'use strict';
var React = require('react');
class ReTableTitleOrder extends React.Component {
    constructor(props) {
        super(props);
        this.state={
            //0初始状态，1单数次点击，2双数次点击
            clickOfDouble:0
        };
        this.orderClick=this.orderClick.bind(this);
        this.getDownClass=this.getDownClass.bind(this);
        this.getUpClass=this.getUpClass.bind(this);
        this.getMainClass=this.getMainClass.bind(this);
    }


    //重新接受参数时判断是否为active项，否则恢复原始状态
    componentWillReceiveProps(nextProps){
        if(nextProps.reClass!='orderTitleItemActive'){
            this.setState({
                clickOfDouble:0
            });
        }
    }

    //根据点击的单双次执行不同的定制函数
    orderClick(){
        if(this.state.clickOfDouble==0||this.state.clickOfDouble==2){
            this.props.clickOfSingle();
            this.setState({
                clickOfDouble:1
            });
        }
        else{
            this.props.clickOfDouble();
            this.setState({
                clickOfDouble:2
            });
        }
    }

    //向上样式
    getUpClass(){
        if(this.state.clickOfDouble==1){
            return 'orderActivePointer'
        }
        else{
            return 'normal'
        }
    }
    //向下样式
    getDownClass(){
        if(this.state.clickOfDouble==2){
            return 'orderActivePointer'
        }
        else{
            return 'normal'
        }
    }

    getMainClass(){
        if(this.props.reClass){
            return 'ReTableTitleOrderContainer '+this.props.reClass;
        }
        else{
            return 'ReTableTitleOrderContainer'
        }
    }

    render(){
        return <div className={this.getMainClass()} onClick={this.orderClick}>
            <div>{this.props.contentText}</div>
            <div className="ReTableTitleOrderPointers">
                <div className={this.getUpClass()}>∧</div>
                <div className={this.getDownClass()}>∨</div>
            </div>
        </div>
    }
}

module.exports=ReTableTitleOrder;